<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>微圈评论列表</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <script src="/layui/layui.js"></script>
    <script src="/jquery/jquery-3.2.1.min.js"></script>
    <link rel="stylesheet" href="/css/Comment/CommodityReview.css"/>
    <style>

    </style>
</head>
<body>
<div class="layui-row boxStyle">
    <div class="layui-col-md10">
        <div class="layui-card headerCenter">
            <div class="layui-card-header backColor">
                微圈评论列表
                <div class="btnRight" style="margin-bottom: 20px">
                    <button onclick="refresh()" type="button" class="layui-btn layui-btn layui-btn-sm">
                        <i class="layui-icon layui-icon-refresh-1"></i>
                        刷新
                    </button>
                    <button onclick="backOff()" type="button" class="layui-btn layui-btn layui-btn-sm">
                        <i class="layui-icon layui-icon-return"></i>
                        返回
                    </button>
                </div>
            </div>
        </div>
        <div class="layui-card headerCenter">
            <div class="layui-card-header backColor sizeWeight">
                <i class="layui-icon layui-icon-form "></i>用户类型
            </div>
        </div>
    </div>
</div>
<br/>
<br/>
<div class="se boxStyle" style="margin-left: 160px">
    <div  id="leadingUser">
        <p class="fl sele1 selectStyle">前端用户</p>
    </div>
    <div  id="management">
        <p class="fl sele2 ">管理人员</p>
    </div>
</div>
<!--评论类型-->
<div class="layui-row boxStyle">
    <div class="layui-col-md10">
        <div class="layui-card headerCenter">
            <div class="layui-card-header backColor sizeWeight">
                <i class="layui-icon layui-icon-form "></i>评论类型
            </div>
        </div>
    </div>
</div>
<br/>
<br/>
<div class="layui-row">
    <div class="layui-col-md10">
        <div id="all" class="se" style="margin-left: 160px">
            <div  id="allComments">
                <p class="fl sele1 selectStyle">全部评论(<span id="allNum"></span>)</p>
            </div>
            <div  id="commentsNormal">
                <p class="fl sele2 ">正常(<span id="normalNum"></span>)</p>
            </div>
            <div  id="commentsBlocked">
                <p class="fl sele3">已拦截(<span id="blockedNum"></span>)</p>
            </div>
            <div  id="commentsDeleted">
                <p class="fl sele4 ">已删除(<span id="deleteNum"></span>)</p>
            </div>
        </div>
    </div>
</div>
<div class="layui-row " style="margin-top: 20px;">
    <div class="layui-col-md10 headerCenter ">
        <table id="demo1" lay-filter="test"></table>
    </div>
</div>
<!--数据列表-->
<div class="layui-row backColor" style="margin-top: 20px">
    <div class="layui-col-md10 headerCenter ">
        <div id="toolutil">
                <span>
                    <i class="layui-icon layui-icon-align-left"></i>
                    数据列表
                </span>
        </div>
        <!--商品表格-->
        <div class="layui-col-md10">
            <table id="demo" lay-filter="test"></table>
        </div>
    </div>
</div>
<script>
        var table ;
        layui.use(['form','jquery','table','laydate'],function() {
        var form = layui.form;
        var jquery = layui.jquery;
        table = layui.table;
        var laydate = layui.laydate;
            tabFrontEnd('');
            useConutTable(1,"");
        //人数次数表格
            function useConutTable(userType,status) {
                $.ajax({
                    url:"/JsComment/countComment",
                    methos:'post',
                    data:{"type":4,"userType":userType,"status":status},
                    dataType:'json',
                    success:function (data) {
                        countNum(data);
                    }
                })
            }
            //评论次数1
            function countNum(data){
                table.render({
                    elem:"#demo1",
                    width:1330,
                    data:data.data,
                    cols:[[
                        {field:"historicalCommentsNum",title:'历史评论次数',align:'center',width:331},
                        {field:"historicalPeopleNum",title:'历史评论人数',align:'center',width:331},
                        {field:"todayCommentsNum",title:'今日评论次数',align:'center',width:331},
                        {field:"todayPeopleNum",title:'今日评论人数',align:'center',width:331},
                    ]],
                    done:function (data) {
                        $("#allNum").text(data.data[0].allComments);
                        $("#normalNum").text(data.data[0].commentsNormal);
                        $("#blockedNum").text(data.data[0].commentsBlocked);
                        $("#deleteNum").text(data.data[0].commentsDeleted);
                    }
                })
            }

            tabBackEnd();
        //后端
            function tabBackEnd(status) {
                $.ajax({
                    url:'/JsComment/getCircleManagementTable',
                    methos:'post',
                    dataType:'json',
                    data:{"status":status},
                    success:function (data) {
                        tab(data);
                    }
                })
            }

        //后端表格
        function tab(data) {
            table.render({
                elem:"#demo",
                width:1345,
                data:data.data,
                page:true,
                cols:[[
                    {type:'checkbox'},
                    {title:'序号', align:'center' ,width:70, templet:function (data) {
                            return data.LAY_INDEX;
                        }},
                    {field:'account',title:'成员账号',align:'center'},
                    {field:'nickName',title:'昵称',align:'center'},
                    {field:'type',title:'所属商品',align:'center',templet:function (data) {
                            if(data.type == 2){
                                type="商品";
                            }else if(data.type == 3){
                                type="课程";
                            }else if(data.type == 4){
                                type="微圈";
                            }
                            return type;
                        }},
                    {field:'commentDate',title:'发言时间',align:'center'},
                    {field:'content',title:'发言内容',align:'center'},
                    {field:'status',title:'状态',align:'center',templet:function (data) {
                            if(data.status == 1){
                                status = "正常";
                            }else if(data.status == 2){
                                status = "已拦截 ";
                            }else if(data.status == 3){
                                status = "已删除";
                            }
                            return "<a class='operation'>"+status+"</a>";
                        }},
                    {title:'操作',align:'center',templet:function (data) {
                            if (data.status == 1){
                                return "<a onclick='intercept("+data.userId+")' class='operation'>拦截</a>"+ '&nbsp;&nbsp;'
                                    +"<a onclick='del("+data.userId+")' class='operation'>删除</a>"+ '&nbsp;&nbsp;'
                                    +"<a onclick='see("+data.id+")' class='operation'>查看</a>";
                            }else if (data.status == 2){
                                return "<a onclick='recovery("+data.userId+")' class='operation'>恢复</a>"+ '&nbsp;&nbsp;'
                                    +"<a onclick='del("+data.userId+")' class='operation'>删除</a>"+ '&nbsp;&nbsp;'
                                    +"<a onclick='see("+data.id+")' class='operation'>查看</a>";
                            }else if(data.status == 3){
                                return "<a class='operation'>已删除</a>";
                            }
                        }},
                ]]
            })
        }
            tabFrontEnd();
            //前端
            function tabFrontEnd(status){
                $.ajax({
                    url:'/JsComment/getCircleUserTable',
                    methos:'post',
                    dataType:'json',
                    data:{"status":status},
                    success:function (data) {
                        tabTwo(data);
                    }
                })
            }

            //前端表格
            function tabTwo(data) {
                table.render({
                    elem:"#demo",
                    width:1345,
                    data:data.data,
                    page:true,
                    cols:[[
                        {type:'checkbox'},
                        {title:'序号', align:'center' ,width:70, templet:function (data) {
                                return data.LAY_INDEX;
                            }},
                        {field:'account',title:'成员账号',align:'center'},
                        {field:'nickName',title:'昵称',align:'center'},
                        {field:'type',title:'所属商品',align:'center',templet:function (data) {
                                if(data.type == 2){
                                    type="商品";
                                }else if(data.type == 3){
                                    type="课程";
                                }else if(data.type == 4){
                                    type="微圈";
                                }
                                return type;
                            }},
                        {field:'commentDate',title:'发言时间',align:'center'},
                        {field:'content',title:'发言内容',align:'center'},
                        {field:'status',title:'状态',align:'center',templet:function (data) {
                                if(data.status == 1){
                                    status = "正常";
                                }else if(data.status == 2){
                                    status = "已拦截 ";
                                }else if(data.status == 3){
                                    status = "已删除";
                                }
                                return "<a class='operation'>"+status+"</a>";
                            }},
                        {title:'操作',align:'center',templet:function (data) {
                                if (data.status == 1){
                                    return "<a onclick='intercept("+data.userId+")' class='operation'>拦截</a>"+ '&nbsp;&nbsp;'
                                        +"<a onclick='del("+data.userId+")' class='operation'>删除</a>"+ '&nbsp;&nbsp;'
                                        +"<a onclick='see("+data.id+")' class='operation'>查看</a>";
                                }else if (data.status == 2){
                                    return "<a onclick='recovery("+data.userId+")' class='operation'>恢复</a>"+ '&nbsp;&nbsp;'
                                        +"<a onclick='del("+data.userId+")' class='operation'>删除</a>"+ '&nbsp;&nbsp;'
                                        +"<a onclick='see("+data.id+")' class='operation'>查看</a>";
                                }else if(data.status == 3){
                                    return "<a class='operation'>已删除</a>";
                                }
                            }},
                    ]]
                })
            }
        //删除
            del = function del(userId){
                $.ajax({
                    url:'/JsComment/del',
                    data:{"userId":userId},
                    dataType:'json',
                    success:function (data) {
                        if(data){
                            layer.msg("删除成功");

                        }else{
                            layer.msg("删除失败");
                        }
                        window.location.reload()  //刷新页面
                    }
                })
            }

            //拦截
            intercept = function intercept(userId){
                layer.open({
                    type: 1,
                    title: "信息",
                    content:"<div style='font-size: 15px ; margin:30px  ;'>您确定要拦截此条信息吗?</div>",
                    area: ['300px', '200px'],
                    btn: ['确定', '取消1'],
                    yes: function (index, layero) {
                        $.ajax({
                            url:'/JsComment/intercept',
                            data:{"userId":userId},
                            dataType:'json',
                            success:function (data) {
                                if(data){
                                    layer.confirm("<i class=\"layui-icon layui-icon-face-smile-fine\"></i> 成功");

                                }else{
                                    layer.msg("拦截失败");
                                }
                                window.location.reload()  //刷新页面
                            }
                        })
                    },
                    btn2: function (index, layero) {
                        layer.close(index);
                    }
                });
            }

            //恢复
            recovery = function recovery(userId){
                $.ajax({
                    url:"/JsComment/recovery",
                    data:{"userId":userId},
                    dateType:'json',
                    success:function (data) {
                        if(data){
                            layer.msg("恢复成功");
                        }else{
                            layer.msg("恢复失败");
                        }
                        window.location.reload()  //刷新页面
                    }
                })
            }

            //图标样式
            //前端用户
            $("#leadingUser").on("click",function () {
                $(this).children(".sele1").addClass("selectStyle").parent().siblings().children(".sele2").removeClass("selectStyle");
            })
            //后台用户
            $("#management").on("click",function () {
                $(this).children(".sele2").addClass("selectStyle").parent().siblings().children("").removeClass("selectStyle");
            })
            //评论样式
            $("#allComments").on("click",function () {
                $(this).children(".sele1").addClass("selectStyle").parent().siblings().children("").removeClass("selectStyle");
            })
            //评论样式
            $("#commentsNormal").on("click",function () {
                $(this).children(".sele2").addClass("selectStyle").parent().siblings().children("").removeClass("selectStyle");
            })
            //评论样式
            $("#commentsBlocked").on("click",function () {
                $(this).children(".sele3").addClass("selectStyle").parent().siblings().children("").removeClass("selectStyle");
            })
            //评论样式
            $("#commentsDeleted").on("click",function () {
                $(this).children(".sele4").addClass("selectStyle").parent().siblings().children().removeClass("selectStyle");
            })

            //刷新
            refresh = function refresh() {
                window.location.reload();
            }

            //返回
            backOff = function backOff() {
                var arr = localStorage.getItem("numArr");
                var numArr = arr.split(",");
                numArr.pop();
                window.parent.layui.element.tabChange('tab',numArr[numArr.length - 1]);
                localStorage.setItem("numArr",numArr);
            }

            showTable();
            function showTable() {
                var flag = true;//true为前端 false为以后端
                var buttons = 0;//0为全部 1为正常 2为拦截 3为删除
                //点击前端用户
                $("#leadingUser").on("click",function () {
                    flag = true;
                    if(buttons == 0){
                        tabFrontEnd();
                        useConutTable("1","");
                    }else if(buttons == 1){
                        tabFrontEnd("1");
                        useConutTable("1","1");
                    }else if(buttons == 2){
                        tabFrontEnd("2");
                        useConutTable("1","2");
                    }else if(buttons == 3){
                        tabFrontEnd("3");
                        useConutTable("1","3");
                    }
                })
                //点击后端用户
                $("#management").on("click",function () {
                    flag = false;
                    if(buttons == 0){
                        tabBackEnd();
                        useConutTable("2","");
                    }else if (buttons == 1){
                        tabBackEnd("1");
                        useConutTable("2","1");
                    } else if(buttons == 2){
                        tabBackEnd("2");
                        useConutTable("2","2");
                    }else if(buttons == 3){
                        tabBackEnd("3");
                        useConutTable("2","3");
                    }
                })
                //点击全部评论
                $("#allComments").on("click",function () {
                    buttons = 0;
                    if(flag){
                        tabFrontEnd("");
                        useConutTable("1","");
                    }else{
                        tabBackEnd("");
                        useConutTable("2","");
                    }
                })
                //点击正常评论
                $("#commentsNormal").on("click",function () {
                    buttons = 1;
                    if(flag){
                        tabFrontEnd("1");
                        useConutTable("1","1");
                    }else{
                        tabBackEnd("1");
                        useConutTable("2","1");
                    }
                })
                //点击已拦截评论
                $("#commentsBlocked").on("click",function () {
                    buttons = 2;
                    if(flag){
                        tabFrontEnd("2");
                        useConutTable("1","2");
                    }else{
                        tabBackEnd("2");
                        useConutTable("2","2");
                    }
                })
                //点击已删除评论
                $("#commentsDeleted").on("click",function () {
                    buttons = 3;
                    if(flag){
                        tabFrontEnd("3");
                        useConutTable("1","3");
                    }else{
                        tabBackEnd("3");
                        useConutTable("2","3");
                    }
                })
            }

            //查看弹出页面
            see = function see(id) {
                //获取微圈详情信息
                $.ajax({
                    url:'/JsComment/getMicrocircleInformation',
                    methos:'post',
                    data:{"id":id},
                    dataType:'json',
                    success:function (data) {
                        localStorage.setItem("PingLun",JSON.stringify(data.data));
                        //弹出层
                        layer.open({
                            type:2,
                            content:"/Comment/CircleComments.html",
                            title:'商品详情',
                            Boolean:true,
                            maxmin: true,
                            area: ['80%', '80%']
                        })
                    }
                })
            }

            $(document).click(function(){//点击iframe页面关闭选项卡菜单
                $(".rightmenu",window.parent.document).hide();
            });
    });
</script>
</body>
</html>